<!--
 * @Author       : wfl
 * @LastEditors  : wfl
 * @description  :
 * @updateInfo   :
 * @Date         : 2022-11-23 15:38:22
 * @LastEditTime : 2023-04-24 09:49:03
-->
<script lang="ts" setup name="CcNode">
import Node from '@main/views/approve-workflow/WorkFlow/tree-node/Node.vue'
import { computed, reactive } from 'vue'

const props = defineProps({
  config: {
    type: Object,
    default: () => {
      return {}
    }
  }
})

const emits = defineEmits<{
  (e: 'selected'): void
  (e: 'insertNode', val: string): void
  (e: 'delNode', node: any): void
}>()

const state = reactive({
  showError: false,
  errorInfo: ''
})

const content = computed(() => {
  if (props.config.props.shouldAdd) {
    return '由发起人指定'
  }
  else if (props.config.props.assignedUser.length > 0) {
    const texts: any[] = []
    props.config.props.assignedUser.forEach((org: { elementName: string; }) =>
      texts.push(org.elementName)
    )
    return String(texts).replaceAll(',', '、')
  }
  return undefined
})

const handSelected = () => {
  emits('selected')
}
const handInsertNode = (type: string) => {
  emits('insertNode', type)
}
const handDelNode = () => {
  emits('delNode', props?.config)
}
</script>

<template>
  <Node
    :title="config.name"
    :show-error="state.showError"
    :content="content"
    :error-info="state.errorInfo"
    placeholder="请设置抄送人"
    header-bgc="#576A95"
    header-icon="ikflow-chaosong"
    @selected="handSelected"
    @delNode="handDelNode"
    @insertNode="(type: string) => handInsertNode(type)"
  />
</template>
